<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>p1_CSS的三种位置</title>
    <!--优先级：行内样式  >  内部样式和外部样式谁在下面谁优先级高-->
    <!--外部样式-->
    <!--ref="stylesheet":表明当前引入的是样式文件-->
    <link rel="stylesheet" href="01.css">
    <!--内部样式：内部的css对当前页面生效-->
    <style>
        /*标签名选择器：选中所有的p元素*/
        p{
            color:blue;
        }
        div{
            width: 100px;
            height: 100px;
            background-color: aqua;
        }

    </style>

</head>
<body>
<!--行内样式，加在当前元素上只对当前元素生效-->
    <h4 style="color:red;background-color:blue">我是标题</h4>
    <h4>我是标题2</h4>
    <p>我是段落</p>
    <p style="color:yellow">我是段落</p>
    <p>我是段落</p>
    <p>我是段落</p>
    <div style="width: 200px;background-color: blue">我是div</div>
    <div>我是div</div>
    <div>我是div</div>

</body>
</html>